<template>
  <!-- 审批管理-节点流转条件设置 -->
  <section class="component process-config-common">
      <el-form :model="saveModel" label-width="130px" ref="form">
        <data-box :nodeFlowModify="true" :selectionList.sync="selectionList" :data="nodeFlowModifyData" :hiddenIndex="true">
          <template slot="columns">
            <el-table-column label="条件类型" prop="conditionTypes">
            </el-table-column>
            <el-table-column label="限制符1" prop="limiter1">
              <template slot-scope="scope">
                <el-select placeholder="请选择" v-model="scope.row.limiter1" v-if="scope.row.conditionTypes !== '系统来源'">
                  <el-option v-for="{index,name,code} in $dict.getDictData('Limiter')" :key="index" :label="name" :value="code">
                  </el-option>
                </el-select>
              </template>
            </el-table-column>
            <el-table-column  label="限制值1" prop="limitValues1">
              <template slot-scope="scope">
                <el-select placeholder="请选择" v-model="scope.row.limitValues1" v-if="scope.row.conditionTypes === '系统来源'">
                  <el-option v-for="{index,name,code} in $dict.getDictData('SysCode')" :key="index" :label="name" :value="code">
                  </el-option>
                </el-select>
                <el-input v-model="scope.row.limitValues1" v-else></el-input>
              </template>
            </el-table-column>
            <el-table-column label="限制符2" prop="limiter2">
              <template slot-scope="scope">
                <el-select placeholder="请选择" v-model="scope.row.limiter2" v-if="scope.row.conditionTypes !== '系统来源'" >
                  <el-option v-for="{index,name,code} in $dict.getDictData('Limiter')" :key="index" :label="name" :value="code">
                  </el-option>
                </el-select>
              </template>
            </el-table-column>
            <el-table-column  label="限制值2" prop="limitValues2">
              <template slot-scope="scope">
                <el-input v-model="scope.row.limitValues2" v-if="scope.row.conditionTypes !== '系统来源'"></el-input>
              </template>
            </el-table-column>
            <!-- <el-table-column label="条件关系" prop="conditionalRelation">
              <template slot-scope="scope">
                <el-select placeholder="请选择" v-model="scope.row.conditionalRelation" >
                  <el-option v-for="{index,name,code} in $dict.getDictData('Relation')" :key="index" :label="name" :value="code">
                  </el-option>
                </el-select>
              </template>
            </el-table-column> -->
          </template>
        </data-box>
      </el-form>
    
    <el-row type="flex" justify="center" style="margin-top:30px">
      <el-button @click="close">取消</el-button>
      <el-button @click="confirm" :loading="submitLoading">确定</el-button>
    </el-row>
  </section>
</template>

<script lang="ts">
import Vue from 'vue';
import Component from 'vue-class-component';
import { Auth, Layout, Dependencies } from '~/core/decorator';
import DataForm from '~/components/common/data-form.vue';
import DataBox from '~/components/common/data-box.vue';
import { Emit, Watch, Prop } from 'vue-property-decorator';
import { FlowTaskService } from '~/services/domain-service/flow-task.service';

@Component({
  components: {
    DataForm,
    DataBox
  },
})
export default class NodeFlowModify extends Vue {
  @Dependencies(FlowTaskService)
  private flowTaskService: FlowTaskService;
  @Prop()
  private modifyData: any;
  @Prop()
  private nodeFlowModifyApplyCategory: any;
  @Prop()
  private nodeFlowModifyApplyData: any;
  @Prop()
  private currentStep: any;
  private allRoleList: any[] = [];
  private saveModel: any = {
    flowNodeModels: [],
    taskName: '',
    commonState: 'ENABLED',
    applyCategory: '',
  };
  private checked:any=false;
  private submitLoading: boolean = false;
  private nodeFlowModifyData: any = [];
  private selectionList: any[] = [];
  private selectionLists: any[] = [];

  @Emit('close')
  private close() {
    this.reset();
  }
  @Emit('nodeFlowConditionsRequestsData')
  private nodeFlowConditionsRequestsData() {
    this.selectionList.map(x=>{
      if(!x.limiter1) x.limiter1 = 'EQUALS'
      if(!x.limiter2) x.limiter2 = 'EQUALS'
    })
    // console.log(this.selectionList,"向父组件传值")
    return this.selectionList
    // return this.nodeFlowModifyData
  }
  private success() {
    this.close();
  }

  //监听每一行的设置按钮点击传值
  @Watch('modifyData', { immediate: true })
  @Watch('nodeFlowModifyApplyCategory', { immediate: true })
  @Watch('nodeFlowModifyApplyData', { immediate: true })
  @Watch('currentStep', { immediate: true })
  private nodeFlowModifyDataSet() {
    this.selectionList = this.nodeFlowModifyApplyData
    console.log(this.nodeFlowModifyApplyData,"节点流转设置进入监听")
    this.nodeFlowModifyData = []
    //判断后端返显的值，此时直接赋值
    if(this.nodeFlowModifyApplyData.length === 3){
      this.nodeFlowModifyApplyData.map(x=>{
        this.nodeFlowModifyData.push({
          conditionTypes:this.$filter.encryptConditionType(x.conditionType),
          conditionType:x.conditionType,
          limiter1:x.limiter1,
          limitValues1:x.limitValues1,
          limiter2:x.limiter2,
          limitValues2:x.limitValues2
        })
      })
      return
    }
    else if(this.nodeFlowModifyApplyData.length === 1){
      if(this.nodeFlowModifyApplyCategory === "DERATE_CASE"){
        this.nodeFlowModifyApplyData.map(x=>{
          this.nodeFlowModifyData.push({
            conditionTypes:this.$filter.encryptConditionType(x.conditionType),
            conditionType:x.conditionType,
            limiter1:x.limiter1,
            limitValues1:x.limitValues1,
            limiter2:x.limiter2,
            limitValues2:x.limitValues2
          })
          this.$dict.getDictData('ConditionType').filter(v=> v.name !== "逾期本金" && v.name !== "坏账金额"&& v.code !== x.conditionType).map(d=>{
            this.nodeFlowModifyData.push({
              conditionTypes:d.name,
              conditionType:d.code,
              limiter1:'',
              limitValues1:'',
              limiter2:'',
              limitValues2:''
            })
          })
        })
        return
      }
      if(this.nodeFlowModifyApplyCategory === "VERIFY_DESTORY"){
        this.nodeFlowModifyApplyData.map(x=>{
          this.nodeFlowModifyData.push({
            conditionTypes:this.$filter.encryptConditionType(x.conditionType),
            conditionType:x.conditionType,
            limiter1:x.limiter1,
            limitValues1:x.limitValues1,
            limiter2:x.limiter2,
            limitValues2:x.limitValues2
          })
  
          this.$dict.getDictData('ConditionType').filter(v=> v.name !== "逾期本金" && v.name !== "减免金额"&& v.code !== x.conditionType).map(d=>{
            this.nodeFlowModifyData.push({
              conditionTypes:d.name,
              conditionType:d.code,
              limiter1:'',
              limitValues1:'',
              limiter2:'',
              limitValues2:''
            })
          })
        })
        return
      }
      this.nodeFlowModifyApplyData.map(x=>{
        this.nodeFlowModifyData.push({
          conditionTypes:this.$filter.encryptConditionType(x.conditionType),
          conditionType:x.conditionType,
          limiter1:x.limiter1,
          limitValues1:x.limitValues1,
          limiter2:x.limiter2,
          limitValues2:x.limitValues2
        })
        this.$dict.getDictData('ConditionType').filter(v=> v.name !== "坏账金额" && v.name !== "减免金额"&& v.code !== x.conditionType).map(d=>{
          this.nodeFlowModifyData.push({
            conditionTypes:d.name,
            conditionType:d.code,
            limiter1:'',
            limitValues1:'',
            limiter2:'',
            limitValues2:''
          })
        })
      })
      return
    }else if(this.nodeFlowModifyApplyData.length === 2){
      const conditionTypeCheck1 = this.nodeFlowModifyApplyData[0].conditionType
      const conditionTypeCheck2 = this.nodeFlowModifyApplyData[1].conditionType
      if(this.nodeFlowModifyApplyCategory === "DERATE_CASE"){
        this.nodeFlowModifyApplyData.map(x=>{
          this.nodeFlowModifyData.push({
            conditionTypes:this.$filter.encryptConditionType(x.conditionType),
            conditionType:x.conditionType,
            limiter1:x.limiter1,
            limitValues1:x.limitValues1,
            limiter2:x.limiter2,
            limitValues2:x.limitValues2
          })
        })
        this.$dict.getDictData('ConditionType').filter(v=> v.name !== "逾期本金" && v.name !== "坏账金额"&& v.code !== conditionTypeCheck1&& v.code !== conditionTypeCheck2).map(d=>{
          this.nodeFlowModifyData.push({
            conditionTypes:d.name,
            conditionType:d.code,
            limiter1:'',
            limitValues1:'',
            limiter2:'',
            limitValues2:''
          })
        })
        return
      }
      if(this.nodeFlowModifyApplyCategory === "VERIFY_DESTORY"){
        this.nodeFlowModifyApplyData.map(x=>{
          this.nodeFlowModifyData.push({
            conditionTypes:this.$filter.encryptConditionType(x.conditionType),
            conditionType:x.conditionType,
            limiter1:x.limiter1,
            limitValues1:x.limitValues1,
            limiter2:x.limiter2,
            limitValues2:x.limitValues2
          })
        })
        this.$dict.getDictData('ConditionType').filter(v=> v.name !== "逾期本金" && v.name !== "减免金额"&& v.code !== conditionTypeCheck1&& v.code !== conditionTypeCheck2).map(d=>{
          this.nodeFlowModifyData.push({
            conditionTypes:d.name,
            conditionType:d.code,
            limiter1:'',
            limitValues1:'',
            limiter2:'',
            limitValues2:''
          })
        })
        return
      }
      this.nodeFlowModifyApplyData.map(x=>{
        this.nodeFlowModifyData.push({
          conditionTypes:this.$filter.encryptConditionType(x.conditionType),
          conditionType:x.conditionType,
          limiter1:x.limiter1,
          limitValues1:x.limitValues1,
          limiter2:x.limiter2,
          limitValues2:x.limitValues2
        })
      })
      this.$dict.getDictData('ConditionType').filter(v=> v.name !== "坏账金额" && v.name !== "减免金额"&& v.code !== conditionTypeCheck1&& v.code !== conditionTypeCheck2).map(d=>{
        this.nodeFlowModifyData.push({
          conditionTypes:d.name,
          conditionType:d.code,
          limiter1:'',
          limitValues1:'',
          limiter2:'',
          limitValues2:''
        })
      })
      return
      
    }else{
      //若没值则初始化值
      if(this.nodeFlowModifyApplyCategory === "DERATE_CASE"){
        this.$dict.getDictData('ConditionType').filter(v=> v.name !== "逾期本金" && v.name !== "坏账金额").map(x=>{
          this.nodeFlowModifyData.push({
            conditionTypes:x.name,
            conditionType:x.code,
            limiter1:'',
            limitValues1:'',
            limiter2:'',
            limitValues2:''
          })
        })
      }else if(this.nodeFlowModifyApplyCategory === "VERIFY_DESTORY"){
        this.$dict.getDictData('ConditionType').filter(v=> v.name !== "逾期本金" && v.name !== "减免金额").map(x=>{
          this.nodeFlowModifyData.push({
            conditionTypes:x.name,
            conditionType:x.code,
            limiter1:'',
            limitValues1:'',
            limiter2:'',
            limitValues2:''
          })
        })
      }else{
        this.$dict.getDictData('ConditionType').filter(v=> v.name !== "坏账金额" && v.name !== "减免金额").map(x=>{
          this.nodeFlowModifyData.push({
            conditionTypes:x.name,
            conditionType:x.code,
            limiter1:'',
            limitValues1:'',
            limiter2:'',
            limitValues2:''
          })
        })
      }
    }
  }
  
  /**
   * 提交表单
   */
  private confirm() {
    if(this.selectionList.length === 0){
      this.$message('请选择条件');
      return
    }
    this.selectionLists = []
    this.nodeFlowModifyData.forEach(row => {
      this.selectionList.forEach(x=>{
        if(x.conditionType===row.conditionType){
          this.selectionLists.push(row)
        }
      })
    })
    // console.log(this.selectionLists,"selectionLists")
    //TODO为了实现点击修改后在不改变默认勾选状态的前提下改变选中条数据更新selectionList
    this.selectionList = this.selectionLists
    this.nodeFlowConditionsRequestsData()
    this.close();
  }
  
  private reset() {
    const form: any = this.$refs['form'];
    form.resetFields();
  }
}
</script>

<style lang="less">
.component.process-config-common {
  .select-role .el-select__tags > span {
    display: inline-flex;
    align-items: center;
    overflow: hidden;
    .el-tag {
      margin: 2px 0 2px 2px;
      padding: 0 5px;
    }
  }
}
</style>
